{% extends "base.html" %}
{% block title %}InviteSquare Home Page{% endblock %}

<!-- Extra style -->
{% block style %}
<link href="/assets/less/home_page.less" rel="stylesheet/less" type="text/css">
{% endblock %}

<!-- Empty Nav Secondary -->
{% block nav_secondary %}{% endblock nav_secondary %}
{% block content %} 
<!-- Example row of columns -->

	<div class="row-fluid">
		<div class="span2">
          <div class="well sidebar-nav">
            <ul class="nav nav-list">
              <li class="nav-header">Categories</li>
              <li class="active"><a href="#"><i class="icon-music"></i>Music</a></li>
              <li><a href="#">Film</a></li>
              <li><a href="#">Sports</a></li>
              <li><a href="#">Entertainment</a></li>	
              <li class="nav-header">Most Popular</li>
              <li class="nav-header">Most Recent</li>
              
             
            </ul>
          </div><!--/.well -->
        </div>
        <!-- Main Column -->
        <div class="span8">
			<!-- The intro header -->
			<header id="overview">
				<div class="span5">
					<h3>Join InviteSquare</h3>
					<p>On top of the scaffolding, basic HTML elements are styled and enhanced with extensible classes to provide a fresh, consistent look and feel.</p>
				</div>
			    <div class="comments span7"> 
					<article class="comment"> 
						<a class="comment-img" href="#non"> 
						<img src="http://lorempixum.com/50/50/people/7" alt="" width="50" height="50"> 
						</a> 
							
						<div class="comment-body"> 
							<div class="text"> 
							  <p>It has multiple paragraphs and is full of waffle to pad out the comment. Usually, you just wish these sorts of comments would come to an end.</p> 
							</div> 
						</div> 
					</article> 
				</div> 
			</header>
			<!-- Container placeholder to add event thumb views -->
			<div id="container"></div>
		</div>
		
		<!-- Right side bar -->
		<div class="span2">
          <div class="well sidebar-nav">
            <ul class="nav nav-list">
              <li class="nav-header">Joined Events</li>
              <li><a href="#">Link</a></li>
              <li><a href="#">Link</a></li>
              <li><a href="#">Link</a></li>
              <li class="nav-header">Watched Events</li>
              <li><a href="#">Link</a></li>
              <li><a href="#">Link</a></li>
              <li><a href="#">Link</a></li>
          
            </ul>
          </div><!--/.well -->
        </div>
	</div>
{% endblock %} 
{% block javascript_main %} 
	<script src="/assets/js/app/post_module.js"></script>
	<script src="/assets/js/app/event_module.js"></script>
	<script type="text/javascript">
		//<![CDATA[
		Invitesq.eventData = {{eventDataJson}} ;
		//]]
	</script>
	<script src="/assets/js/app/home_page_module.js"></script>
{% endblock %}